
let form = layui.form
// 获取链接列表
function rander() {
  $.ajax({
    url: '/admin/links',
    success: function (res) {
      console.log(res);
      let str = ''
      res.data.forEach(item => {
        str += `
        <tr>
        <td>${item.id}</td>
        <td>
          <div class="bg">
            <img src="http://192.168.151.67:8888/uploads/${item.linkicon}">
          </div>
        </td>
        <td>${item.linkname}</td>
        <td>${item.linkurl}</td>
        <td>${item.linkdesc}</td>
        <td>
          <button data-id="${item.id}" type="button" class="layui-btn layui-btn-xs edit">
            编辑
          </button>
          <button data-id="${item.id}" type="button" class="layui-btn layui-btn-xs layui-btn-danger delete">
            删除
          </button>
        </td>
      </tr>
        `
      })
      $('tbody').html(str)
      }
     })
}
rander()
// ------------------------------添加链接-------------------------------
let addIndex 
$('#add-link').on('click', function () {
    addIndex =  layer.open({
        type:1,
        title: '添加类别',
        content: $('#add-form-tpl').html(),
        area:['500px','400px']
    });
  // 绑定文件上传按钮点击事件
$('#urlIcon').on('click',function () {
  $('#linkFile').trigger('click')
})
// 监听文件选中事件
$('#linkFile').on('change',function (e) {
  const objectURL = URL.createObjectURL(e.target.files[0])
  $('#preIcon').attr('src', objectURL)
})  
 
$('body').on('submit', '#add-form', function (e) {
  e.preventDefault()
  let fd = new FormData(this)
  $.ajax({
    type: 'POST',
    url: '/admin/links',
    data: fd,
    contentType: false,
    processData:false,
    success: function (res) {
      if (res.status ===0) {
        layer.close(addIndex)
        rander()
        }
     }
  })
}) 
})
// ---------------------------------编辑链接---------------------------------------
let editIndex 
$('tbody').on('click', '.edit', function () {
  
  // 数据回填
  let id = $(this).data('id')
  // console.log(id);
  $.ajax({
    type: 'GET',
    url: '/admin/links/' + id,
    success: function (res) {
      editIndex = layer.open({
        type: 1,
        title: '添加类别',
        content: $('#edit-form-tpl').html(),
        area: ['500px', '400px']
      })
      console.log(res.data);
      $('#preIcon').attr('src', 'http://192.168.151.67:8888/uploads/' + res.data.linkicon)
      form.val('editForm', res.data)
      
     // 绑定文件上传按钮点击事件
     $('#urlIcon').on('click',function () {
     $('#linkFile').trigger('click')
     })
     // 监听文件选中事件
     $('#linkFile').on('change',function (e) {
       const objectURL = URL.createObjectURL(e.target.files[0])
       $('#preIcon').attr('src', objectURL)
     })
     // ------------------提交表单--------------------------
     $('body').on('submit', '#edit-form', function (e) {
      e.preventDefault()
      let fd = new FormData(this)   
      $.ajax({
        type: 'PUT',
        url: '/admin/links/' + id,
        data: fd,
        contentType: false,
        processData:false,
        success: function (res) {
          // console.log(res);
          layer.confirm('您确定要修改吗？', function () {
            layer.close(editIndex)
            layer.msg(res.message)
            rander()
           })
         
         }
      })
     })
      //-------------------------------重置----------------------
     
    } 
    
  })
  
})





















//-------------------------删除---------------------------
$('tbody').on('click', '.delete', function () {
  let id = $(this).data('id')
  $.ajax({
    type: 'DELETE',
    url: '/admin/links/' + id,
    success: function (res) {
      layer.confirm('你确定要删除吗？', function () {
        layer.msg(res.message)
        rander()
       })
       
     }
  })
})

